package com.smart.jetpackcomposestate.todo.four

import androidx.compose.foundation.clickable
import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.PaddingValues
import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.lazy.LazyColumn
import androidx.compose.foundation.lazy.items
import androidx.compose.material3.Button
import androidx.compose.material3.Icon
import androidx.compose.material3.LocalContentColor
import androidx.compose.material3.MaterialTheme
import androidx.compose.material3.Scaffold
import androidx.compose.material3.Text
import androidx.compose.runtime.Composable
import androidx.compose.runtime.remember
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.res.stringResource
import androidx.compose.ui.text.style.TextAlign
import androidx.compose.ui.unit.dp
import com.smart.jetpackcomposestate.todo.TodoIcon
import com.smart.jetpackcomposestate.todo.TodoItem
import com.smart.jetpackcomposestate.ui.theme.DN_Compose_LearnTheme
import com.smart.jetpackcomposestate.util.generateRandomTodoItem
import kotlin.random.Random

/**
 * @author huangzehui
 * @date 2025/8/5 13:54 周二
 * @description
 */


@Composable
fun TodoScreen(
    modifier: Modifier,
    items: List<TodoItem>,
    currentlyEditing: TodoItem?,
    onAddItem: (todoItem: TodoItem) -> Unit,
    onRemoveItem: (todoItem: TodoItem) -> Unit,
    onStartEdit: (TodoItem) -> Unit,
    onEditItemChange: (TodoItem) -> Unit,
    onEditDone: () -> Unit,
) {
    Column(modifier = modifier) {

        // 当currentlyEditing(当前编辑条目)为空时，显示添加输入
        // 否则进入编辑状态时，最顶部会显示“Editing item"文本

        val enableTopSection = (currentlyEditing == null)


        // 输入框外加一个灰色背景
        TodoItemInputBackground(elevate = true) {
            if (enableTopSection) {
                TodoItemEntryInput(onItemCompleted = onAddItem)
            } else {
                Text(
                    text = "Editing item", style = MaterialTheme.typography.headlineLarge,
                    // 设置文字居中
                    textAlign = TextAlign.Center,
                    modifier = Modifier
                        // 设置组件在父视图居中
                        .align(Alignment.CenterVertically)
                        .padding(16.dp)
                        // 宽度填充父容器
                        .fillMaxWidth()
                )
            }

        }

        // 多行
        LazyColumn(modifier = Modifier.weight(1f), contentPadding = PaddingValues(8.dp)) {
            items(items) { todo ->
                if (currentlyEditing?.id == todo.id) {
                    TodoItemInlineEditor(
                        item = currentlyEditing,
                        onEditItemChange = onEditItemChange,
                        onEditDone = onEditDone,
                        onRemoveItem = {
                            onRemoveItem(todo)
                        })
                } else {
                    TodoRow(
                        todoItem = todo, modifier = Modifier
                            // 填充父容器的最大宽度
                            .fillParentMaxWidth(),
                        onItemClicked = { todoItem: TodoItem ->
                            onStartEdit(todoItem)
                        }
                    )
                }
            }
        }

        Button(
            onClick = {
                onAddItem(generateRandomTodoItem())
            },
            modifier = Modifier
                .padding(16.dp)
                // 最大宽度
                .fillMaxWidth(),
        ) {
            Text(text = "Add random item")
        }
    }
}

@Composable
fun TodoRow(
    modifier: Modifier = Modifier,
    todoItem: TodoItem,
    onItemClicked: (todoItem: TodoItem) -> Unit
) {
    Row(
        modifier = modifier
            .clickable {
                onItemClicked(todoItem)
            }
            .padding(horizontal = 16.dp, vertical = 8.dp),
        // Arrangement.SpaceBetween : 子元素水平均匀分布
        horizontalArrangement = Arrangement.SpaceBetween,
    ) {
        Text(text = todoItem.task)
        // remember 是会在可组合函数内存上做存储
        // remember 有个key，这个key不变，那么随机到的tint就会一直一样
        // 应该是如果没有变化，缓存有，直接拿，并重新调用 remember 的 calculation 方法
        val iconAlpha = remember(todoItem.id) {
            randomTint()
        }
        Icon(
            imageVector = todoItem.icon.imageVector,
            tint = LocalContentColor.current.copy(alpha = iconAlpha),
            contentDescription = stringResource(id = todoItem.icon.contentDescription)
        )
    }
}

/**
 * 生成随机的 tint
 */
private fun randomTint(): Float {
    // coerceIn ： 指定生成的随机数的区间
    return Random.nextFloat().coerceIn(0.3f, 0.9f)
}